<template>
  <div class="home_card">
    <div class="rowTitle">
      <!-- <span>注册会员数</span> -->
      <span>{{ $t("Home.index8") }}</span>
      <date-range-picker
        @change="getData"
        v-model="query_time"
        class="date-item"
      />
    </div>
    <div class="cardContent">
      <line-chart :chartData="LineData" />
    </div>
  </div>
</template>

<script>
import LineChart from "@/components/Echarts/LineChart";
import DateRangePicker from "@/components/DateRangePicker/index_shouye";
import { getLineStatistical } from "@/api/home";

export default {
  components: {
    LineChart,
    DateRangePicker,
  },
  data() {
    return {
      query_time: [],
      LineData: { date: [], data: [] },
    };
  },
  mounted() {
    this.getData();
  },
  methods: {
    getData() {
      getLineStatistical({
        start_time:
          this.query_time && this.query_time[0]
            ? parseInt(this.query_time[0] / 1000)
            : "",
        end_time:
          this.query_time && this.query_time[1]
            ? parseInt(this.query_time[1] / 1000)
            : "",
      })
        .then((res) => {
          if (res.code == 10000) {
            this.LineData = res.data;
          } else {
            this.$message.error(res.message);
          }
        })
        .catch((error) => {
          this.$message.error(error.Error);
        });
    },
  },
};
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
.rowTitle {
  margin-bottom: 0 !important;
}
</style>
